<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <div class="contain">
        <header>
            <ul>
                <li><a href="" class="title_active">关于</a></li>
                <li><a href="">产品</a></li>
                <li><a href="">方案</a></li>
                <li><a href="">服务</a></li>
                <li><a href="">联系</a></li>
            </ul>
        </header>
        <main>
            <!-- 轮播图 -->
            <div class="carousel_box" style="display: none;">
                <!-- 图片 -->
                <div class="img_box">
                    <!-- 图片列表 -->
                    <ul>
                        <li><a href="javascript:void(0)"><img src="../images/01.jpeg"></a></li>
                        <li><a href="javascript:void(0)"><img src="../images/02.jpeg"></a></li>
                        <li><a href="javascript:void(0)"><img src="../images/03.jpeg"></a></li>
                        <li><a href="javascript:void(0)"><img src="../images/04.jpeg"></a></li>
                    </ul>

                    <!-- 左右箭头 -->
                    <div class="arrow_left">&lt;</div>
                    <div class="arrow_right">&gt;</div>
                </div>

                <!-- 小圆点 -->
                <div class="dot_box">
                    <span class="dot dotActive" data-index=1></span>
                    <span class="dot" data-index=2></span>
                    <span class="dot" data-index=3></span>
                    <span class="dot" data-index=4></span>
                </div>
            </div>

            <!-- 内容区域一 -->
            <div class="main1">
                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam corrupti vel id, esse aperiam
                    ipsa
                    neque veniam repellendus soluta cum quae porro aliquam dolore iste architecto ipsum laudantium,
                    reiciendis iusto!</p>

                <img src="../images/06.jpeg" alt="">
            </div>

            <!-- 内容区域二 -->
            <div class="main2">
                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam corrupti vel id, esse aperiam
                    ipsa
                    neque veniam repellendus soluta cum quae porro aliquam dolore iste architecto ipsum laudantium,
                    reiciendis iusto!Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam corrupti vel
                    id, esse aperiam
                    ipsa
                    neque veniam repellendus soluta cum quae porro aliquam dolore iste architecto ipsum laudantium,
                    reiciendis iusto!</p>

                <img src="../images/07.jpeg" alt="">
            </div>
        </main>
        <footer>
            <h1>footer</h1>
        </footer>
    </div>


    <script src="./js/index2.js" type="module"></script>
    <!-- <script src="./js/index.js"></script> -->
</body>

</html>